<template>
	<view class="wrap u-flex-col">
		<view class="searchBox v-flex">
			<view class="dateTime">
				<text>日期：</text>
				<input v-model="startTime" disabled="true" @click="timerShow = true" />
				<text>至</text>
				<input v-model="endTime" disabled="true" @click="timerShow = true" />

				<u-button style="margin-left:10rpx;" type="primary" size="mini">查询</u-button>
			</view>
		</view>
		<view class="u-flex-1 mapBox">
			<map style="width: 100%; height: 100%" :latitude="latitude" :scale="scale" :longitude="longitude" :markers="markers" :polyline="polyline"></map>
			</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			startTime: '',
			endTime: '',
			latitude: 25.539394,
			longitude: 119.785582,
			scale:14,
			markers: [
				{
					latitude: 25.531015,
					longitude: 119.778611,
					iconPath: '../../../../static/images/car.png'
				},
				{
					latitude: 25.525244,
					longitude: 119.802074,
					iconPath: '../../../../static/images/car.png'
				},
			],
			polyline:[{
				points:[
					{
						latitude: 25.531015,
						longitude: 119.778611,
					},
					{
						latitude: 25.540404,
						longitude: 119.782815,
					},
					{
						latitude: 25.534666,
						longitude: 119.793163,
					},
					{
						latitude: 25.530232,
						longitude: 119.791618,
					},
					{
						latitude: 25.525244,
						longitude: 119.802074,
					}
				],
				color:'#b40000',
				width:5,
				// arrowLine:true
			}]
		};
	},
	methods: {
		reachBottom() {}
	}
};
</script>

<style lang="scss" scoped>
.wrap {
	height: calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
	// background-color: rgb(240, 242, 244);
}
.searchBox {
	padding: 20rpx;
	.dateTime {
		line-height: 56rpx;
		font-size: 22rpx;
		text {
			float: left;
			margin: 0 10rpx;
		}
		input {
			font-size: 22rpx;
			float: left;
			width: 200rpx;
			height: 56rpx;
			line-height: 56rpx;
			padding: 0 10rpx;
			border: 1px solid #d9d9d9;
			border-radius: 0.3em;
		}
	}
}
.mapBox{
	height:100%;
}
.myScroll {
	height: 100%;
}
</style>
